import {ElementRef, Directive, NgModule}  from '@angular/core';

@Directive({
	selector: '[disabled]',
	inputs: ['disabled']
})
class DisabledDirct {
	el:HTMLElement;
	
	constructor(private elRef: ElementRef) {
		this.el = elRef.nativeElement;
	}
	
	set disabled(v:any){
		this.el.disabled = v ? "disabled" : null;
	};
}

@Directive({
	selector: '[html]',
	inputs: ['html']
})
class InnerHtmlDirct {
	el:HTMLElement;
	
	constructor(private elRef: ElementRef) {
		this.el = elRef.nativeElement;
	}
	
	set html(v:any){
		this.el.innerHTML= v;
	};
}

@Directive({
	selector: '[val]',
	inputs: ['val','vals']
})
class CheckedDirct {
	el:HTMLElement;
	vals:any;
	
	constructor(private elRef: ElementRef) {
		this.el = elRef.nativeElement;
	}
	
	set val(v:any){this.v = v; this.checked();}
	
	set vals(v:any){this.vs = v; this.checked();}
	
	checked(){
		if(this.vs && this.v){
			let result = this.vs.filter((o)=>{
				if(!o) return false;
				return Object.keys(this.v).every((k)=>{
					return o[k]==this.v[k];
				})
			});
			
			if(result && result.length>0){
				this.el.setAttribute("checked", "");
			}
		} else {
			this.el.removeAttribute("checked");
		}
	}
}

@NgModule({
	declarations:[DisabledDirct,InnerHtmlDirct, CheckedDirct],
	exports:[DisabledDirct,InnerHtmlDirct, CheckedDirct]
})
export class DirectivesM{}
